import React, {
    Component,
} from 'react';

import {
    StyleSheet,
    Text,
    View,
    Platform,
    FlatList,
    Dimensions,
    TouchableOpacity,
    Image,
    ScrollView,
    StatusBar,
    Linking,
    ActivityIndicator,
    DeviceEventEmitter,
    TextInput,
} from 'react-native';

import HttpUtils from "../../utils/HttpUtils";
import HttpUrls from "../../utils/HttpUrls";
import Constant from '../../utils/Constant'//全局变量
import Header from "../../components/header";
import { ToastToUser } from '../../utils/CustomToast';
import Loading from "../../utils/Loading";

const isIos = Platform.OS == 'ios';
const screenW = Dimensions.get('window').width;

let navigation;

export default class AddAuthorizePage extends Component {

    constructor(props) {
        super(props);
        this.state = {
            orgName:'',
            psnMobile:''
        }
    }

    componentWillUnmount() {

    }

    componentDidMount() {

    }

    render() {
        navigation = this.props.navigation;
        return (
            <View style={styles.container}>
                <Header navigation={navigation} Title={'添加授权'} />
                <View style={styles.tipsContainer}>
                    <Text style={styles.tipsTitle}>请填写注e签宝的企业名称</Text>
                </View>
                <View style={styles.inputContainer}>
                    <Text style={styles.inputTitle}>企业名称</Text>
                    <TextInput
                        editable={true}
                        style={styles.inputbox}
                        placeholder='请输入企业名称'
                        placeholderTextColor={'#999999'}
                        value={this.state.orgName}
                        onChangeText={this.onChangeTextHandle.bind(this)}
                    ></TextInput>
                </View>

                <View style={styles.tipsContainer}>
                    <Text style={styles.tipsTitle}>请填写注e签宝注册企业下的法人或企业管理员</Text>
                </View>

                <View style={styles.inputContainer}>
                    <Text style={styles.inputTitle}>经办人手机号</Text>
                    <TextInput
                        editable={true}
                        style={styles.inputbox}
                        placeholder='请输入手机号'
                        placeholderTextColor={'#999999'}
                        value={this.state.psnMobile}
                        maxLength={11}
                        keyboardType="numeric"
                        onChangeText={this.onChangeTextHandleMobile.bind(this)}
                    ></TextInput>
                </View>

                <TouchableOpacity
                    style={{ position:'absolute' ,bottom: 30}}
                    onPress={this.submit.bind(this)}
                  >
                    <View style={styles.nextContaner}>
                        <Text style={styles.nextTitle}>下一步</Text>
                    </View>
                        
                </TouchableOpacity>

                <Loading onRef={(ref) => (this.Loading = ref)} />
            </View>
        )
    }

       // 输入的企业名称
    onChangeTextHandle = (value) => {
        this.setState({ orgName: value });
    }

    onChangeTextHandleMobile= (value) => {
        this.setState({ psnMobile: value });
    }

    submit(){
        if (!this.state.orgName) {
            ToastToUser('请先输入企业名称')
            return;
        }
        if (!this.state.psnMobile) {
            ToastToUser('请先输入经办人手机号')
            return;
        }

         if(this.state.psnMobile.length !=11){
            ToastToUser('手机号必须为11位')
            return;
        }



        if (this.Loading) {
            this.Loading.show();
        }

        let param = {
            orgName: this.state.orgName,
            psnMobile: this.state.psnMobile,
            merchantId: Constant.userInfo.merchantId,
        }

        HttpUtils.postRequest(HttpUrls.esginAutnauth, param)
            .then((result) => {
                console.log(result)
                if (this.Loading) {
                    this.Loading.hide();
                }
                let code = result.code
                if (code == 0) {
                    navigation.replace('WebView', {source: result.data.authUrl})
                }else {
                    ToastToUser(result.msg)
                }
            })
            .catch((error) => {

            });


    }

   

}

const styles = StyleSheet.create({

    container: {
        width: screenW,
        flex: 1,
        backgroundColor: '#f6f6f6',
        position:'relative'
    },

    tipsContainer:{
        width:screenW,
        height:42,
        backgroundColor:'#ffffff',
        justifyContent:'center',
        marginTop:10

    },

    tipsTitle:{
        marginLeft:16,
        fontWeight: '500',
        fontSize: 16,
        color: '#333333',
    },

    inputContainer:{
        width:screenW,
        height:46,
        backgroundColor:'#ffffff',
        alignItems:'center',
        flexDirection:'row',
    },

    inputTitle:{
        fontWeight: '400',
        fontSize: 14,
        color: '#333333',
        marginLeft:16,
    },

    inputbox:{
        width:'100%',
        height:'100%',
        left:110,
        position:'absolute',
        fontSize: 14,
        padding: 0, 
        margin:0,
    },

    nextContaner:{
        marginLeft:16,
        marginRight:16,
        width: screenW-32,
        height:46,
        borderRadius: 4,
        backgroundColor:'#FFE000',
        alignItems:'center',
        justifyContent:'center',
 
    },

    nextTitle:{
        fontSize: 15,
        color: '#222222',
        fontWeight: '500', 

    }

 

})